<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core">

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />        
        <link href="#{request.contextPath}/css/Template.css" rel="stylesheet" type="text/css"/>
        <script src="#{request.contextPath}/scripts/PrimeFacesES.js" type="text/javascript"></script>
        <title><ui:insert name="title">DISUTRAN S.A.</ui:insert></title>
    </h:head>

    <h:body>
        <div id="wrapper">
            <div id="header">
                <h:form>

                    <center>
                        <a href="../faces/index.xhtml"><img src="../img/banner.png" width="709" height="100"/></a>
                    </center>

                    <div style="font-size: small" align="right">
                        <p:commandButton id="menuSesion" value="Bienvenido, #{usuarioController.getNombreUsuario()}" type="button" />
                    </div>

                    <div style="font-size: small" align="left">
                        <p:overlayPanel id="imagePanel" for="menuSesion" showEffect="fade" hideEffect="fade">
                            <ul>
                                <li>
                                    <p:commandLink action="/index.xhtml" value="Inicio" ajax="false"/>
                                </li>
                                <li>
                                    <p:commandLink action="/CambioContrasena.xhtml" value="Cambiar contraseña" ajax="false"/>
                                </li>
                            </ul>
                        </p:overlayPanel>   
                    </div>            
                    <div style="margin-top: 5px"></div>
                    <div align="right" style="margin-top: 10px; font-size: small">
                        <p:clock mode="server"></p:clock>
                    </div>
                    <div style="font-size: smaller; margin-top: 10px" align="center" >
                        <p:menubar  model="#{menuController.model}" autoDisplay="false" style="font-size: small; background: white">
                            <f:facet name="options">
                                <p:commandButton value="Cerrar Sesión" icon="ui-icon-extlink" action="#{loginController.cerrarSesion()}" ajax="false" />
                            </f:facet>
                        </p:menubar>
                    </div>                
                </h:form>        
            </div>

            <div id="content">                
                <ui:insert name="body">Default Body</ui:insert>                            
            </div>

            <div id="footer">
                <center>
                    <table border="0">
                        <tbody>
                            <tr>
                                <td style="text-align: center;">El &eacute;xito m&aacute;s que una meta una actitud.</td>
                                <td style="text-align: center;" rowspan="2"><img src="../img/logo_peq.png" alt="" width="50" height="40" /></td>
                            </tr>
                            <tr>
                                <td style="text-align: center;">Copyright &#169; 2014 por CCSOFT.</td>
                            </tr>
                        </tbody>
                    </table>                    
                </center>
            </div>
        </div>
    </h:body>    
</html>
